<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@include file="../../mytags.jsp" %>
<html>
<head>
    <t:base type="jquery"></t:base>
    <script type="text/javascript" src="webpage/com/wx/added_product/procurement/shoppingCar.js"></script>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <title>零件采购</title>
    <script type="text/javascript" charset="utf-8">
        mui.init({
            swipeBack: false //启用右滑关闭功能
        });
    </script>
    <style type="text/css">
        .gd{
            margin-left:5px !important;
            margin-top:10px;
            float:right !important;
            width:60%
        }
        .h-div{
            width:100px;height:100px;float:left;margin: 10px 0px 0px -12px
        }
    </style>

</head>
<body>
<div class="pro mui-clearfix" style="position: fixed;z-index: 1000; top: -1px;">
    <div class="mui-content"
         style="margin-top:0px; width: 80%; float: left; background: none; padding: 20px;border-radius:0;">
        <form id='login-form' action="javascript:loadPart();" class="mui-input-group"
              style="background: #6f0109;border-color: #e70012; display: none">
            <div class="mui-input-row mui-input-row1"
                 style="height: 40px;padding-left: 5px;background: none;border: none;  ; ">
                <input type="text" class="mui-input" id="name" placeholder="请输入商品关键字"
                       style="width:65%;padding-left:0 ;color:#fff;font-size: 14px; ">
                <label style="float: right; width: 50px;text-align: left;padding-top:8px;"><a
                        href="javascript:loadPart();"><img src="${webRoot}images/sach.png" style="width: 25px;"></a>
                </label>
            </div>
        </form>
    </div>
    <div class="cf">
        <img src="${webRoot}images/cf.png">
        <p>商品分类</p>
    </div>
    <div class="cff">
        <ul>
            <li><a href="javascript:loadPart('')"><img src="${webRoot}images/cf.png">全部</a>
            </li>
            <li><a href="javascript:loadPart('<%=StaticValue.CLASSIFY_FITTING%>')"><img src="${webRoot}images/cff1.png">配件</a>
            </li>
            <li><a href="javascript:loadPart('<%=StaticValue.CLASSIFY_CONSUMABLE%>')"><img
                    src="${webRoot}images/cff2.png">耗材</a></li>
        </ul>
    </div>
</div>
<div class="chanp" id="partDiv">
    <ul>
        <c:forEach items="${partList }" var="part">
            <li class="mui-clearfix">
                <div style="width:100px;height:100px;float:left;margin: 10px 0px 0px -12px"
                     onclick="location.href='purchaseorderController.do?purchaseorder_con&id=${part.id }'">
                    <c:if test="${empty part.filePath }">
                    <img class="with-img-border" src="${webRoot}images/cfff.jpg">
                </c:if> <c:if test="${!empty part.filePath }">
                    <img class="with-img-border" src="cbsPartInfoController.do?downLoadFile&filePath=${part.filePath }">
                </c:if>
                </div>
                <div class="gd">
                    <h2 class="mui-ellipsis-2" style="font-weight: bold;">${part.wechatName }</h2>
                    <h3 class="price-group">
                        <span>¥<fmt:formatNumber value="${part.wechatPrice }" pattern="#,###.00"/></span>
                        <span style="color:#fff;background-color:red;font-weight:500;font-size:0.9em;padding-left:3px;padding-right:1px;border:1px solid #fff">微信优惠价</span><br/>
                        <span>¥<fmt:formatNumber value="${part.terminalPrice }" pattern="#,###.00"/></span>
                    </h3>
                    <h2>
                        <%--<a onclick="addShoppingCar('${part.id}',this,true)">立即购买</a>--%>
                        <%--<c:if test="${permission ne 0}">
                            <span class="btn-add2car" onclick="addShoppingCar('${part.id}',this)">加入购物车</span>
                        </c:if>--%>
                            <span class="btn-add2car" onclick="addShoppingCar('${part.id}',this)">加入购物车</span>
                    </h2>
                </div>
            </li>
        </c:forEach>
    </ul>
</div>
<div class="mui-checkbox car-footer" style="position:fixed">
    <div class="footer-right">
        <span class="summary" id="partInfo" >合计：<b></b></span>
        <div class="btn" onclick="location.href='purchaseorderController.do?shop'">购物车(<b id="count"></b>)</div>
    </div>
</div>
<%--<div class="mui-input-row mui-checkbox mui-left  quanx">
    <h3 style="margin-left:15px;">已选<span id="count"
                                          style="font-size: 18px; padding-right: 5px; color: #e70012;"></span>件商品<a
            href="purchaseorderController.do?shop&userId=">购物车</a></h3>
</div>--%>
</body>
</html>

<script>
    function loadPart(type) {
//        $(".cff").hide();
        $('.cf').trigger("click");
        var name = $('#name').val();
        $.post('purchaseorderController.do?getPartInfoList', {sort: type, name: name}, function (data) {
            data = $.parseJSON(data);
            var str = "";
            $('#partDiv').find('ul').remove();
            for (var i = 0; i < data.length; i++) {
                str += '<ul><li class="mui-clearfix partInfo-li">';
                str += '<div class="h-div" onclick="location.href=\'purchaseorderController.do?purchaseorder_con&id=' + data[i].id + '\'">';
                if (data[i].filePath != '' && data[i].filePath != null) {
                    str += '<img class="with-img-border" src="cbsPartInfoController.do?downLoadFile&filePath=' + data[i].filePath + '">';
                } else {
                    str += '<img class="with-img-border" src="${webRoot}images/cfff.jpg">';
                }
                str += '</div>';
                str += '<div class="gd">';
                str += '<h2 class="mui-ellipsis-2" style="font-weight: bold;">' + data[i].wechatName + '</h2>';
                str += '<h3 class="price-group"><span>¥' + data[i].wechatPrice.toFixed(2) + '</span><br/>';
                str += '<span>¥'+data[i].terminalPrice.toFixed(2)+'</span></h3>';
                str += '<h2><span class="btn-add2car" onclick="addShoppingCar(\'' + data[i].id + '\',this)">加入购物车</span></h2>';
                str += '</div>';
                str += '</li></ul>';
            }
            $('#partDiv').append(str);

            mui('.mui-numbox').numbox();
        })
    }
    function addShoppingCar(id, obj, buyNow) {
        var count = $("#count").text();
        var selNumObj = $(obj).parent().siblings().children().children("input[type='number']")
        if (!$.isEmptyObject(selNumObj)) {
            _Car.addItem({id: id, num: 1}, function () {
                $("#count").text(this.carInfo.totalCount);
                $("#partInfo").find("b").text('¥'+formatMoney(_Car.getCarInfo().checkedPrice,2));
                if (buyNow) {
                    _Car.openSimpleWindow(_Car.link.settle);
                } else {
                    _Car.msg.addToCarSuc();
                }
            })
        }
    }

    function num() {
        var num = $("#num").val();
        return num;

    }


    $(function () {
        $("#name").focus(function () {
            $(".cff").hide();
        })
        var number = 0;
        $(".cf").toggle(function(){
            $('.cff').show();
        },function(){
            $('.cff').hide();
        })
        /*$('.cf').click(function () {
            if (number == 0) {

                number = 1;
            } else if (number == 1) {
                $('.cff').hide();
                number = 0;
            }

        })*/
        setTimeout(function(){
            $("#count").text(_Car.getCarInfo().totalCount);
            $("#partInfo").find("b").text('¥'+formatMoney(_Car.getCarInfo().checkedPrice,2));
        },500);
    })
</script>